<template>
  <!-- 增改用户弹框 -->
  <hcDialog dialogWidth="70%" dialogTitle="报告详情" :isVisable="options.show" @closeDialog="closeFun" @openDialog="openFun">
    <div class="d-t table-form">
      <hcTable :table-data="list" :options="tableopt" :columns="tableColumn"> </hcTable>
    </div>
  </hcDialog>
</template>
<script setup>
import { onMounted, reactive, ref } from "vue";
import { useI18n } from "vue-i18n";
let { t } = useI18n();

const emit = defineEmits(["closeDialog"]);

const props = defineProps({
  options: {
    type: Object,
    default: () => {
      return {
        show: false,
        data: null, // 当前编辑的用户
      };
    },
  },
});

let tableopt = {
  showPagination: false,
  border: true,
};

let list = ref([]);

let tableColumn = [
  { type: "index", width: "60", label: "序号", align: "center", fixed: true },
  { prop: "variable_name", label: "变量名称", align: "center" },
  { prop: "description", label: "变量描述", align: "center" },
  { prop: "min_value", label: "最小值", align: "center" },
  { prop: "max_value", label: "最大值", align: "center" },
  { prop: "units", label: "单位", align: "center" },
  { prop: "plc_id", label: "PLC地址", align: "center" },
];

// 关闭弹框
const closeFun = () => {
  emit("closeDialog");
};

function openFun() {
  let data = props.options.data;
  list.value = data.map((item) => item.statusVariable);
}
</script>
<style lang="scss" scoped>
.d-t {
  min-height: 300px;
  width: 100%;
  display: flex;
}
:deep(.el-table .el-table__body tr td) {
  background-color: rgba(87, 96, 115, 0.8) !important;
  color: #fff;
}
</style>
